/**
 * Created by charlie on 18-1-16.
 */
import React, { Component } from 'react';
import {
    Modal,
    Text,
    View ,
    StyleSheet,
    TouchableOpacity
} from 'react-native';
import Colors from '../../assets/colors'
import { Actions } from 'react-native-router-flux'


export default class dialog extends Component {
    render() {
        const {isShow,text,thisCancled,back} = this.props;
        const {thisShow,beChecked }= this.props.thisDialog;
        return(
            <View>
                <Modal
                    animationType='fade'
                    onRequestClose={()=> this.onRequestClose()}
                    visible={beChecked?thisShow:isShow}
                    // animationType={'fade'}/'slide'
                    // onRequestClose={()=>this.setState({visibility:false})}
                    // visible={this.props.visibility}
                    transparent={true}
                >
                    <View style={styles.mainView}>
                        <View style={styles.dialogView}>
                            <View style={styles.dialogTitle}>
                                <Text style={{fontSize:25}}>温馨提示</Text>
                            </View>
                            <View style={styles.dialogCenter}>
                                <Text style={{fontSize:18}}>{text}</Text>
                            </View>
                            <View style={styles.dialogBottom}>
                                <View style={{width:'50%',justifyContent: 'center',alignItems: 'center',borderRightWidth:1,borderRightColor:'white'}}>
                                    <TouchableOpacity style={{backgroundColor:Colors.dataBlueBg,width:'100%',height:'100%',borderBottomLeftRadius:6,
                                                                justifyContent: 'center',alignItems: 'center'}}
                                                      onPress={back ==='back'?() => {Actions.pop()}:thisCancled}>
                                        <View >
                                            <Text style={{fontSize:18,color:Colors.btnPrimaryBg}}>取消</Text>
                                        </View>
                                    </TouchableOpacity>
                                </View>

                                <View style={{width:'50%',justifyContent: 'center',alignItems: 'center',}}>
                                    <TouchableOpacity style={{backgroundColor:Colors.dataBlueBg,width:'100%',height:'100%',borderBottomRightRadius:6,
                                                                justifyContent: 'center',alignItems: 'center'}}
                                                      onPress={back ==='back'?() => {Actions.pop()}:thisCancled}>
                                        <View >
                                            <Text style={{fontSize:18,color:Colors.btnPrimaryBg}}>确定</Text>
                                        </View>
                                    </TouchableOpacity>
                                </View>
                            </View>
                        </View>
                    </View>
                </Modal>
            </View>

        );
    }

}


const styles = StyleSheet.create({
    mainView:{
        width: '100%',
        height: '100%',
        backgroundColor: 'rgba(52,52,52,0.5)',
        justifyContent: 'center',
        alignItems: 'center',
    },
    dialogView:{
        // width:'40%',
        // height:'40%',
        marginLeft:'20%',
        marginRight:'20%'
    },
    dialogTitle:{
        backgroundColor:Colors.backgroundLightGray,
        justifyContent: 'center',
        alignItems: 'center',
        borderTopLeftRadius:6,
        borderTopRightRadius:6,
        height:50,
    },
    dialogCenter:{
        backgroundColor:'white',
        justifyContent: 'center',
        alignItems: 'center',
        height:150,
    },
    dialogBottom:{
        backgroundColor:Colors.dataBlueBg,
        justifyContent: 'center',
        // alignItems: 'center',
        borderBottomLeftRadius:6,
        borderBottomRightRadius:6,
        height:50,
        flexDirection: 'row',
        // flex:1
    },
})